<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#d1{ width:100px; height:100px; border:1px solid #999}
/*#d2{  height:1000px; border:1px solid #999}*/
#d3{ width:100px; height:100px; border:1px solid #999}
#a1{width:100px; height:100px; border:1px solid #999; background:#0F3}
#a2{width:100px; height:100px; border:1px solid #999; background:#CF0}
#a1:target{ color:#F00; background: #999}
#a2:target{ color:#F00; background: #999}
.e1{ width:100px ; height:30px; border:1px solid; float: left; text-align:center; line-height:30px}
.e2{ width:300px; height:300px; border:1px solid; background: #0F3 }
.e2 img{ width:300px; height:300px; display:none;  }
.e2 img:target{ display:block;}
.clear{ clear:both}
.w1{ height:100px; width:500px;-webkit-column-gap:5px;	
-webkit-column-count:3; 
-webkit-column-rule:2px solid red; border:1px solid #CCC}
.w1{-moz-column-gap:5px;	
    -moz-column-count:3; 
    -moz-column-rule:2px solid red;}
</style>
</head>

<body>
<div id="d1">顶部<P><a href="#d3">跳转至底部</a></P></div>
 <p><a href="#a1">跳转至内容1</a></p>
<p><a href="#a2">跳转至内容2</a></p>
<div id="a1">内容1</div><div id="a2">内容2</div>

<div id="d2">内容</div>
<div id="d3">底部<P><a href="#d1">返回顶部</a></P></div>
<div class="e1"><a href="#img_1">m1</a></div>
<div class="e1"><a href="#img_2">m2</a></div>
<div class="e1"><a href="#img_3">m3</a></div>
<div class="clear"></div>
<div class="e2">

<div class="w1">像突如其来温暖我的晴天想秋日大街那纷飞的落叶传过云和烟看大地慢慢的浮现像突如其来温暖我的晴天想秋日大街那纷飞的落叶传过云和烟看大地慢慢的浮现像突如其来温暖我的晴天想秋日大街那纷飞的落叶传过云和烟看大地慢慢的浮现像突如其来温暖我的晴天想秋日大街那纷飞的落叶传过云和烟看大地慢慢的浮现</div>
</body>
</html>
